<template>
  <div class="doc">
    <div class="pre">{{ doc }}</div>
    <div>
      <List />
      <List />
    </div>
  </div>
</template>
<script>
import { computed, reactive, provide, watch } from "vue";
import DocStep from "./doc.step.js";
export default {
  name: "Doc",
  // mixins: [doc],
  data() {
    return {};
  },
  // setup:docStep,
  setup(props, context) {
    console.log(props);
    let docStep = DocStep();
    provide("doc", docStep.model.doc);
    return {
      docStep
    };
  },
  inject: ["doc"],
  mounted() {
    window.doc = this;
    console.log(this.doc, this);
    // this.doc.user.name = 9;
    // this.doc.user.name1 = 9;
    // this.$api("test.get");
    // this.$ajax({
    //   method: "post",
    //   url: "test.get",
    //   params: { a: 1 },
    //   data: { a: 2 }
    // });
  },
  updated() {
    console.log("[app][updated]");
  },
  beforeUnmount() {}
};
</script>
<style>
.doc {
  margin: 10px;
  padding: 5px;
  box-shadow: 0 0 3px #ddd;
}
</style>
